<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        function fn (cb1, cb2) {
            setTimeout (() => {
                const a = Math.random();
                cb1(a);
            }, 1000);
            setTimeout (() => {
                const b = Math.random();
                cb2(b);
            }, 1000);
        }

        // 全局作用域下得到a的值、b的值
        // 全局作用域下不知道a和b的值，用回调函数解决这个问题
        fn(
            (x) => {
                console.log('a:', x);
            }, 
            (y) => {
                console.log('b:', y);
            },
        );

        // 求和
        function fn1 (cb) {
            const arr = [];
            setInterval(() => {
                arr.push(arr.length);
                cb && cb(arr);
            }, 1000);
        }

        // 请用回调函数的方式 每秒打印一次arr的数字之和
        // fn1(
        //     (arr) => {
        //         let sum = 0;
        //         for (let i = 0; i < arr.length; i++) {
        //             sum += arr[i];
        //         }
        //         console.log(sum);
        //     }
        // );
    
        // 请用回调函数的方式 每秒打印一次arr的数字之和
        fn1((arr) => {
            console.log(arr.reduce((prev, current) => prev + current));
        });
        // 请用回调函数的方式，求第五秒时arr的数字之和
        fn1((arr) => {
            if (arr.length === 5) {
                console.log(arr.reduce((prev, current) => prev + current));
            }
        })

    </script>
</body>
</html>